﻿<style>
/* Penerapan efek pada tulisan */
@-webkit-keyframes gantiwarna {0% {color:white}
20% {color:LightCoral}
40% {color:SkyBlue}
60% {color:YellowGreen}
80% {color:Khaki}
100% {color:white}
}
@-moz-keyframes gantiwarna {
0% {color:white}
20% {color:LightCoral}
40% {color:SkyBlue}
60% {color:YellowGreen}
80% {color:Khaki}
100% {color:white}
}
@-ms-keyframes gantiwarna {
0% {color:white}
20% {color:LightCoral}
40% {color:SkyBlue}
60% {color:YellowGreen}
80% {color:Khaki}
100% {color:white}
}
@-o-keyframes gantiwarna {
0% {color:white}
20% {color:LightCoral}
40% {color:SkyBlue}
60% {color:YellowGreen}
80% {color:Khaki}
100% {color:white}
}
@-keyframes gantiwarna {
0% {color:white}
20% {color:LightCoral}
40% {color:SkyBlue}
60% {color:YellowGreen}
80% {color:Khaki}
100% {color:white}
} 
#light { 
animation: 5s infinite gantiwarna linear;
-webkit-animation: 5s infinite gantiwarna linear 
}
 

/* Penerapan efek pada background */  
@-webkit-keyframes gantiwarna2 {
  0% {background-color:black}
  20% {background-color:PaleVioletRed}
  40% {background-color:MediumSlateBlue}
  60% {background-color:YellowGreen}
  80% {background-color:DarkKhaki}
  100% {background-color:black}
}
@-moz-keyframes gantiwarna2 {
  0% {background-color:black}
  20% {background-color:PaleVioletRed}
  40% {background-color:MediumSlateBlue}
  60% {background-color:YellowGreen}
  80% {background-color:DarkKhaki}
  100% {background-color:black}
}
@-ms-keyframes gantiwarna2 {
  0% {background-color:black}
  20% {background-color:PaleVioletRed}
  40% {background-color:MediumSlateBlue}
  60% {background-color:YellowGreen}
  80% {background-color:DarkKhaki}
  100% {background-color:black}
}
@-o-keyframes gantiwarna2 {
  0% {background-color:black}
  20% {background-color:PaleVioletRed}
  40% {background-color:MediumSlateBlue}
  60% {background-color:YellowGreen}
  80% {background-color:DarkKhaki}
  100% {background-color:black}
}
@-keyframes gantiwarna2 {
  0% {background-color:black}
  20% {background-color:PaleVioletRed}
  40% {background-color:MediumSlateBlue}
  60% {background-color:YellowGreen}
  80% {background-color:DarkKhaki}
  100% {background-color:black}
}
.tulisbreaking {
  animation:10s infinite gantiwarna2 linear;
  -webkit-animation:10s infinite gantiwarna2 linear;
}


/* Penerapan efek ribbon007 */
.riben007 { color:#fff; font-family:Cambria,Georgia,Times,Serif; font-size:20px; margin:0 -20px 10px -50px; padding:0px 50px; text-align:center; font-weight:bold; line-height:48px; -moz-text-shadow:2px 0 0 #333; -webkit-text-shadow:2px 0 0 #333; text-shadow:2px 0 0 #333; -webkit-box-shadow:inset 0 0 25px #40E0D0,0px 1px 5px #666; -moz-box-shadow:inset 0 0 25px #40E0D0,0px 1px 5px #666; box-shadow:inset 0 0 25px #40E0D0,0px 1px 5px #666; background-color:#4169E1; left:15px; position:relative; }
.riben007:before { content:&#39; &#39; ; position:absolute; bottom:-10px; left:0; width:0; height:0; border-style:solid; border-width:10px 0 0 10px; border-color:#6495ED #6495ED transparent transparent; }
.riben007:after { content:&#39; &#39; ; position:absolute; bottom:-10px; right:0; width:0; height:0; border-style:solid; border-width:0 0 10px 10px; border-color:#6495ED transparent transparent #6495ED; }


.blogger-clickTrap { display:none }
.quickedit { display:none }
header,nav,section,aside,article,footer { display:block }
* { -moz-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing:border-box }
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td { border:0; font-family:inherit; font-size:100%; font-style:inherit; font-weight:inherit; margin:0; outline:0; padding:0; vertical-align:baseline }
li { list-style:none }
ul a { text-decoration:none; }
ul a:hover { text-decoration:none; color:#860000 }
:focus{outline:0}
#NoScript{ background-color:#fff; border-top:2px solid #0073B4; border-bottom:2px solid #0073B4; height:100%;  padding:5px 0; position:absolute; text-align:center; width:100%; z-index:9999 }
#NoScript h6{ color:rgb(102,102,102); font-size:24px; margin-left:-30px; margin-top:-18px; position:absolute; text-align:center; top:30%; width:100%}
body, .body-fauxcolumn-outer { background-color:#908878; margin:0; padding:0; font-family:Segoe UI; font-size:12px; text-align:justify; }
ol,ul { list-style:none }
a img { margin-top:0; -webkit-transition:all .4s ease-in-out; margin-top:0; -moz-transition:all .4s ease-in-out; margin-top:0; -o-transition:all .4s ease-in-out; margin-top:0; -ms-transition:all .4s ease-in-out; margin-top:0; transition:all .4s ease-in-out }
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section { display:block }
/* Headings */
h1,h2,h3,h4,h5,h6 { clear:both }
hr { background-color:#ccc; border:0; height:1px; margin-bottom:1.625em }

/* Text elements */
p { margin-bottom:20px }
ul,ol { margin:0 0 1.625em 2.5em }
ul { list-style:square }
ol { list-style-type:decimal }
ol ol { list-style:upper-alpha }
ol ol ol { list-style:lower-roman }
ol ol ol ol { list-style:lower-alpha }
ul ul,ol ol,ul ol,ol ul { margin-bottom:0 }
dl { margin:0 1.625em }
dt { font-weight:bold }
dd { margin-bottom:1.625em }
strong { font-weight:bold }
cite,em,i { font-style:italic }
  blockquote {background: #f9f9f9;border-left: 10px solid #ccc;margin: 1.5em 10px;padding: .5em 10px;quotes: &quot;201C&quot;&quot;201D&quot;&quot;2018&quot;&quot;2019&quot;;}
  blockquote:before {color: #ccc;content: open-quote;font-size: 4em;line-height: .1em;margin-right: .25em;vertical-align: -.4em;}
  blockquote {font-family: &quot;Arial&quot;,&quot;Verdana&quot;,Serif;font-size: 16px;padding: 50px 5px;position: relative;text-align: center;}
  blockquote p {margin: 0 0 20px;display: inline;}
  blockquote:before {top: 25px;}
  blockquote:after {bottom: 25px;}
  blockquote:before, blockquote:after {background-image: -webkit-linear-gradient(left,#eee,#eee 35%,#f3a01e 35%,#f3a01e 45%,#d05d2a 45%,#d05d2a 55%,#9dc425 55%,#9dc425 65%,#eee 65%,#eee);background-image: -moz-linear-gradient(left,#eee,#eee 35%,#f3a01e 35%,#f3a01e 45%,#d05d2a 45%,#d05d2a 55%,#9dc425 55%,#9dc425 65%,#eee 65%,#eee);background-image: -ms-linear-gradient(left,#eee,#eee 35%,#f3a01e 35%,#f3a01e 45%,#d05d2a 45%,#d05d2a 55%,#9dc425 55%,#9dc425 65%,#eee 65%,#eee);background-image: -o-linear-gradient(left,#eee,#eee 35%,#f3a01e 35%,#f3a01e 45%,#d05d2a 45%,#d05d2a 55%,#9dc425 55%,#9dc425 65%,#eee 65%,#eee);content: &quot;&quot;;height: 1px;left: 0;position: absolute;right: 0;}

/* Links */
a{color:#346FC9; text-decoration:none; -o-transition:0.6s linear; -ms-transition:0.6s linear; -moz-transition:0.6s linear; -webkittransition:0.6s linear; transition:all .4s ease-out;}
a:focus,a:active,a:hover { transition-duration:0s; text-decoration:none }

/* Table css */
table[border=&quot;1&quot;] { border-collapse:collapse; color:#333 }
table[border=&quot;1&quot;] tr { background-color:#F0F0F0 }
table[border=&quot;1&quot;] th,table[border=&quot;1&quot;] td { vertical-align:top; padding:5px 10px; border:2px solid #fff }
table[border=&quot;1&quot;] tr:nth-child(even) { background-color:#DEDEDE }
table[border=&quot;1&quot;] th { background-color:#AD3000; border-radius:10px 10px 0 0; -moz-border-radius:10px 10px 0 0; -webkit-border-radius:10px 10px 0 0; color:#fff; font-weight:bold }

/* Widgets */
.widget ul { margin:0 }
.widget ul ul { margin-left:1.5em }
.widget ul li { text-decoration:none }
.widget a { font-weight:normal; text-decoration:none }
.widget a:hover,.widget a:focus,.widget a:active { text-decoration:none; color:#AD3000 }
/* Footer */
  
/* Header */
#header-wrapper { background-color:#FFFFF0; color:#000; position:relative; width:100%; margin:0 auto; padding:0 0 10px; -webkit-box-shadow:inset 0 0 25px 2px #000; -moz-box-shadow:inset 0 0 25px 2px #000; box-shadow:inset 0 0 25px 2px #000 }
#headtitle { display:inline-block; text-align:center; margin-bottom:10px; width:100%; float:left }
#isihead { overflow:hidden }
#header h1 { font-size:0px; line-height:1.2em; text-align:center; text-transform:uppercase; font-family: &#39;Dr Sugiyama&#39;, serif }
#header a { color:#000; text-decoration:none; text-align:center }
#header a:hover { color:#9ACD32 }
#header .description { display:inline; font-weight:normal }
#header img { margin-left:auto; margin-right:auto }
.titlewrapper { font-size:200%; color:#000 }
.clearfix { clear:both; height:0; line-height:0 }
.emoWrap { margin:10px 0 0 }
  
/* My Header Style */
#flash {
display: inline-block;
text-shadow: #F70909 0 -1px 1px, #F70909 0 -2px 1px;
font-family: &quot;Dr Sugiyama&quot;, serif;
font-size: 50px;
}
#flash:hover {
text-shadow: #1DD545 0 0 4px, #fcffbb 0 0 20px;
}
#light {
display: inline-block;
text-shadow: #5CE3FA 0 0 1px;
font-family: &quot;Dr Sugiyama&quot;, serif;
font-size: 50px;
}
#light:hover {
text-shadow: #1DD545 0 0 4px, #fcffbb 0 0 20px;
}
  
/* Navigation */
#navmobi,#navmobitop { display:none }
#nav { position:relative; background-color:#6495ED; width:100%; font-weight:normal; height:42px; margin:0 auto; z-index:100 }
ul#navinti { height:42px; float:left; margin:0; padding:0 }
#navinti li { list-style:none; display:inline-block; float:left; position:relative; margin:0; padding:0 }
#navinti li a { display:block; line-height:42px; text-decoration:none; color:white; -moz-text-shadow:2px 0 0 #6495ED; -webkit-text-shadow:2px 0 0 #333; text-shadow:2px 0 0 #333; padding:0 15px }
#navinti li:hover &gt; a { background-color:#000 }
#navinti li a.active { background-color:#000; color:#fff }
ul#navinti .sub-menu { position:absolute; padding:0; width:250px; z-index:9999; margin:0; background-color:#6495ED; box-shadow:0 0 30px rgba(0,0,0,.35); -moz-box-shadow:0 0 30px rgba(0,0,0,.35); -webkit-box-shadow:0 0 30px rgba(0,0,0,.35); top:100%; left:0; display:none; -moz-text-shadow:none; -webkit-text-shadow:none; text-shadow:none }
ul#navinti .sub-sub-menu { display:none; padding:0; margin:0; width:170px; position:absolute; left:100%; z-index:9999; box-shadow:0 0 30px rgba(0,0,0,.35); -moz-box-shadow:0 0 30px rgba(0,0,0,.35); -webkit-box-shadow:0 0 30px rgba(0,0,0,.35); top:0; background-color:#6495ED; -moz-text-shadow:none; -webkit-text-shadow:none; text-shadow:none }
ul#navinti li:last-child .sub-sub-menu { left:auto; right:100%; text-align:left }
ul#navinti li:last-child .sub-menu { right:0; left:auto; text-align:right }
ul#navinti .sub-menu a { line-height:32px; color:#fff; font-weight:normal; background-color:#6495ED; -moz-text-shadow:none; -webkit-text-shadow:none; text-shadow:none }
ul#navinti .sub-menu li:hover &gt; a { background-color:#333; color:#fff; -moz-text-shadow:none; -webkit-text-shadow:none; text-shadow:none }
ul#navinti li:last-child .sub-menu a:hover,ul#navinti li:last-child .sub-menu li:hover &gt; a { border-left:0 }
ul#navinti .sub-menu li { float:none; display:block }
ul#navinti ul.hidden { display:none }
ul#navinti li:hover .sub-menu.hidden,ul#navinti .sub-menu li:hover .sub-sub-menu.hidden { display:block }
#navinti li.dgnsub &gt; a { padding-right:22px }
#navinti li.dgnsub &gt; a::after,#navinti li.dgnssub &gt; a::after { content:&quot; &quot; ; width:0; height:0; border-width:5px 3px; border-style:solid; border-color:white transparent transparent transparent; position:absolute; top:20px; right:8px }
#navinti li.dgnssub &gt; a::after { border-color:transparent transparent transparent #303030; border-width:5px 4px; top:50%; margin-top:-5px; right:2px }
#navinti li:last-child li.dgnssub &gt; a::after { border-color:transparent #303030 transparent transparent; right:auto; left:2px }

/* main */
#outer-css { background-color:#6495ED; width:750px; margin:0 auto; padding:0 5px }
#outer-wrapper { background-color:#E6E6FA; float:left; width:100%; padding:10px; margin:0 auto; -webkit-box-shadow:inset 0 0 25px rgba(0,0,0,0.3),0px 1px 5px #333; -moz-box-shadow:inset 0 0 25px rgba(0,0,0,0.3),0px 1px 5px #333; box-shadow:inset 0 0 25px rgba(0,0,0,0.3),0px 1px 5px #333 }
#Content { width:100% }
#contentInner { background-color:#0070B0; width:100%; margin:0 auto }
#atas-posting { float:left; width:100%; margin-top:5px; margin-bottom:5px }
#kotak-utama { float:left; width:100%; margin:0 auto }
#kotak-bawah { background-color:transparent; float:left; width:100%; margin:0 auto; padding:10px 10px 0 }
.kotak-dalem { background-color:transparent; padding:0; margin-bottom:10px }
.content_box { background-color:#fff; padding:10px }
.content_box img { background-color:#f7f7f7; display:block; margin:0 auto; max-width:95%; height:auto; padding:3px; text-align:center; border:1px solid #ccc; -moz-border-radius:2px; -webkit-border-radius:2px; border-radius:2px }
#comments.comments.content_box img { background-color:transparent; display:inline; margin:0; max-width:100%; padding:1px; border:none; text-align:left; -moz-box-shadow:none; -webkit-box-shadow:none; box-shadow:none; -moz-border-radius:0; -webkit-border-radius:0; border-radius:0 }
.content_box h1 { color:#fff; font-family:Cambria,Georgia,Times,Serif; font-size:20px; margin:0 -20px 10px -50px; padding:0px 50px; text-align:center; font-weight:bold; line-height:48px; -moz-text-shadow:2px 0 0 #333; -webkit-text-shadow:2px 0 0 #333; text-shadow:2px 0 0 #333; -webkit-box-shadow:inset 0 0 25px #40E0D0,0px 1px 5px #666; -moz-box-shadow:inset 0 0 25px #40E0D0,0px 1px 5px #666; box-shadow:inset 0 0 25px #40E0D0,0px 1px 5px #666; background-color:#4169E1; left:15px; position:relative; }
.content_box h1:before { content:&#39; &#39; ; position:absolute; bottom:-10px; left:0; width:0; height:0; border-style:solid; border-width:10px 0 0 10px; border-color:#6495ED #6495ED transparent transparent; }
.content_box h1:after { content:&#39; &#39; ; position:absolute; bottom:-10px; right:0; width:0; height:0; border-style:solid; border-width:0 0 10px 10px; border-color:#6495ED transparent transparent #6495ED; }
.content_box h1 a { color:#333333; text-decoration:none }
.content_box h1 a:hover { color:#0370A8; text-decoration:none }
.content_box .postmeta { color:#434343 }
.spanstyle { margin-bottom:10px; float:left; border-top:2px solid #000; width:100% }
.content_box div span a { color:#0370a8; text-decoration:none }
  
/* sidebar1 */
#sidebar-left { float:left; width:49% }
#widgets1 { -moz-box-shadow:0 0 3px #e0e0e0; -webkit-box-shadow:0 0 3px #e0e0e0; box-shadow:0 0 3px #e0e0e0; padding:0; margin:0 }
#widgets1 h2{ background-color:#666; position:relative; padding:3px 5px 5px 13px; color:#FFF; letter-spacing:1px; text-transform:uppercase; -moz-text-shadow:0 1px 0 white; -webkit-text-shadow:0 1px 0 white; text-shadow:0 1px 0 white; -o-transition:0.6s linear; -ms-transition:0.6s linear; -moz-transition:0.6s linear; -webkit-transition:0.6s linear;transition:all .4s ease-out}
#widgets1 h2:before {
  content:&quot;&quot;;
  width:0px;
  height:0px;
  position:absolute;
  right:0;
  top:0;
  border-width:12px;
  border-style:solid;
  border-color:transparent #f4f4f4 transparent transparent;
}
#widgets1 .widget { margin:0 0 10px; padding:0 0 }
#widgets1 .widget-content { background-color:#fff; padding:5px 7px 7px 7px; height:auto; margin:0 auto; -webkit-box-shadow: 0 1px 1px #666;-moz-box-shadow: 0 1px 1px #666;box-shadow: 0 1px 1px #666 }
#widgets1 ul li a:hover { color:#AD3000 }
  
/* sidebar2 */
#sidebar-right { float:right; width:49%; }
#widgets2 { -moz-box-shadow:0 0 3px #e0e0e0; -webkit-box-shadow:0 0 3px #e0e0e0; box-shadow:0 0 3px #e0e0e0; padding:0; margin:0 }
#widgets2 h2{ background-color:#666; position:relative; padding:3px 5px 5px 13px; color:#FFF; letter-spacing:1px; text-transform:uppercase; -moz-text-shadow:0 1px 0 white; -webkit-text-shadow:0 1px 0 white; text-shadow:0 1px 0 white; -o-transition:0.6s linear; -ms-transition:0.6s linear; -moz-transition:0.6s linear; -webkit-transition:0.6s linear;transition:all .4s ease-out}
#widgets2 h2:before {
  content:&quot;&quot;;
  width:0px;
  height:0px;
  position:absolute;
  right:0;
  top:0;
  border-width:12px;
  border-style:solid;
  border-color:transparent #f4f4f4 transparent transparent;
}
#widgets2 .widget { margin:0 0 10px; padding:0 0 }
#widgets2 .widget-content { background-color:#fff; padding:5px 7px 7px 7px; height:auto; margin:0 auto; -webkit-box-shadow: 0 1px 1px #666;-moz-box-shadow: 0 1px 1px #666;box-shadow: 0 1px 1px #666; overflow:auto }
#widgets2 ul li a:hover { color:#AD3000 }
  
/* main page */
#text-body { line-height:1.3em; font-weight:lighter; clear:both }
#text-body h1 { font-size:20px; font-weight:normal; margin:0; padding:0; border:none; line-height:1.3em; }
#text-body h2 { font-size:18px; line-height:1.3em; }
#text-body h3 { font-size:16px; font-weight:normal; line-height:1.3em; }
#text-body h4 { font-size:14px; line-height:1.3em; }
#text-body h5 { font-size:12px; line-height:1.3em; }
#text-body h6 { font-size:10px; line-height:1.3em; }
#text-body ul { list-style:circle; margin-left:20px; padding:0; color:#2A0037 }
#text-body li { list-style:circle; margin-left:5px; padding:0; color:#2A0037 }

/* copyright and social network */  
#kredit-link { background-color:#6495ED; font-family:Segoe UI; color:#fff; text-align:center; height:auto; overflow:hidden; font-size:14px; padding:10px 10px 10px; margin:0; }
#kredit-link a { color:#F4A460 }
#kredit-link a:hover { color:yellow }
#kredit-link .right { float:right; text-align:right; overflow:hidden }
#kredit-link .left { float:left; text-align:left; overflow:hidden }
  
#bottom-social { background-color:transparent; margin:0 auto; margin-top:-5px; text-align:center; padding:5px; width:100% }
a.soicon { color:#4169E1; margin-right:3px; display:inline-block; height:24px; line-height:24px; padding-left:22px; background-image:url(http://4.bp.blogspot.com/-xle7tRvibpc/UIecojbG6kI/AAAAAAAACw0/lvzIR05C3tI/s1600/socialicons.png); background-position:0 -6px; background-repeat:no-repeat; -webkit-transition:color .4s ease-in-out; -moz-transition:color .4s ease-in-out; -o-transition:color .4s ease-in-out; -ms-transition:color .4s ease-in-out; transition:color .4s ease-in-out }
a.soicon:hover { color:#fdd700 }
a.facebookx { background-position:0 -6px }
a.facebookx:hover { background-position:0 -150px }
a.twitterx { background-position:0 -79px }
a.twitterx:hover { background-position:0 -223px }
a.googlex { background-position:0 -43px }
a.googlex:hover { background-position:0 -187px }
a.rssx { background-position:0 -115px }
a.rssx:hover { background-position:0 -259px }
.nibbler-badge { position:absolute; padding-left:3px; margin:0 auto }
  
.addthis_toolbox {width:150px;position:relative;float:right}
.addthis_toolbox .sharethis-tooltip {display:block;width:90%;padding:5px 5px;position:absolute;bottom:100%;left:20px;z-index:77;margin-bottom:40px;background-color:black;font:bold 12px &#39;Trebuchet MS&#39;,Arial,Sans-Serif;color:white;text-align:center;-webkit-box-shadow:0px 1px 2px rgba(0,0,0,0.4);-moz-box-shadow:0px 1px 2px rgba(0,0,0,0.4);box-shadow:0px 1px 2px rgba(0,0,0,0.4);-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;opacity:0;visibility:hidden;-webkit-transition:all 0.26s ease-out;-moz-transition:all 0.26s ease-out;-ms-transition:all 0.26s ease-out;-o-transition:all 0.26s ease-out;transition:all 0.26s ease-out}
.addthis_toolbox .sharethis-tooltip:before {content:&quot;&quot;;width:0px;height:0px;border:7px solid transparent;border-top-color:black;position:absolute;top:100%;left:25px}
.addthis_toolbox:hover .sharethis-tooltip {visibility:visible;opacity:1;margin-bottom:20px}

/* css button back to top */
#backtop{cursor:pointer;position:fixed!important;position:absolute;left:50%;bottom:-70px;z-index:999;background-color:#fff;border:1px solid #333;-webkit-box-shadow:inset 0 0 25px rgba(0,0,0,0.3),0px 1px 5px #333;-moz-box-shadow:inset 0 0 25px rgba(0,0,0,0.3),0px 1px 5px #333;box-shadow:inset 0 0 25px rgba(0,0,0,0.3),0px 1px 5px #333;width:35px;height:50px;overflow:hidden;text-indent:-999px;-webkit-border-top-left-radius: 10px;
-webkit-border-top-right-radius:5px; -moz-border-radius-topleft:5px; -moz-border-radius-topright:5px; border-top-left-radius:5px; border-top-right-radius:5px;}

/* css load more posts and blog-pager */
#blog-pager { margin-bottom:5px; margin-top:0 }
#blog-pager-newer-link { -moz-box-shadow:0 4px 6px rgba(0,0,0,0.1),0 1px 1px rgba(0,0,0,0.3); -webkit-box-shadow:0 4px 6px rgba(0,0,0,0.1),0 1px 1px rgba(0,0,0,0.3); box-shadow:0 2px 6px rgba(0,0,0,0.1),0 1px 1px rgba(0,0,0,0.3); background-color:#ddd; padding:5px 10px; color:#333; text-shadow:1px 1px 0 #E0E0E0; border-left:5px solid #666; border-right:5px solid #666; display:none }
  #blog-pager-older-link { -moz-box-shadow:0 4px 6px rgba(0,0,0,0.1),0 1px 1px rgba(0,0,0,0.3); -webkit-box-shadow:0 4px 6px rgba(0,0,0,0.1),0 1px 1px rgba(0,0,0,0.3); box-shadow:0 2px 6px rgba(0,0,0,0.1),0 1px 1px rgba(0,0,0,0.3); background-color:#ddd; padding:5px 10px; color:#333; text-shadow:1px 1px 0 #E0E0E0; margin:0 0 5px }
#blog-pager { text-align:center }
.feed-links { display:none }
#backtop::after{content:&quot;&quot;;position:absolute;top:7px;left:10px;width:0;height:0;border-width:10px 7px;border-style:solid;border-color:transparent transparent #000 transparent;}
  
/* css quick search */
#search-form-feed { padding:0; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing:border-box; width:150px; float:right; margin-top:7px; position:relative; margin-right:7px }
#feed-q-input { display:block; width:100%; height:28px; border:1px solid #2B2B2B; color:#838383; margin:0; font-size:10px; padding-left:10px; -moz-border-radius:2px; -webkit-border-radius:2px; float:left; background-color:white }
#feed-q-input:focus { color:#333; outline:none; -webkit-box-shadow:0 0 5px #153E95,0 0 7px #153E95; -moz-box-shadow:0 0 5px #153E95,0 0 7px #153E95; box-shadow:0 0 5px #153E95,0 0 7px #153E95 }
#search-result-container { width:300px; overflow:auto; position:absolute; z-index:9999; padding:10px; right:0; margin:0; top:42px; display:none; font-size:11px; background-color:white; text-transform:none; -moz-box-shadow:inset 0 0 7px #d6d6d6; -webkit-box-shadow:inset 0 0 7px #d6d6d6; box-shadow:inset 0 0 7px #d6d6d6; -moz-border-radius:2px; -webkit-border-radius:2px; border-radius:2px; border:1px solid #ccc }
#search-result-container li { margin:0 0 5px; padding:0; list-style:none; word-wrap:break-word; font-size:10px; color:#141414; background-color:white; text-transform:none }
#search-result-container li a { text-decoration:none; font-weight:bold; font-size:11px; display:block; line-height:14px; padding:0; font-weight:bold }
#search-result-container mark { background-color:yellow; color:black }
#search-result-container h4 { margin:0 0 10px; font:normal bold 12px; color:black }
#search-result-container ol { margin:0 0 10px; padding:0 0; overflow:auto; height:300px }
#search-result-container:hover ol { overflow:auto }
#search-result-container li img { display:block; float:left; margin:0 5px 1px 0; padding:2px; border:1px solid #D1D1D1 }
#search-result-loader { top:100%; position:absolute; z-index:999; width:100%; line-height:30px; color:#2E2E2E; padding:0 10px; background-color:white; border:1px solid #DBDBDB; margin:0; overflow:hidden; display:none; text-transform:capitalize }
#search-result-container p { margin:5px 0 }
#search-result-container .close { position:absolute; right:8px; top:8px; font-size:12px; color:white; text-decoration:none; border-radius:9999px; width:13px; height:13px; text-indent:1px; background-color:#1295C9; line-height:12px }
#search-form-feed button { background-repeat:repeat-x; background-position:left -3px; background-color:#01B8C0; -webkit-border-top-left-radius:0; -webkit-border-bottom-left-radius:0; -moz-border-top-left-radius:0; -moz-border-bottom-left-radius:0; border-top-left-radius:0; border-bottom-left-radius:0; text-indent:-9999px; width:50px; overflow:hidden; margin:0; padding:7px 10px 6px; height:26px; font-size:12px; font-family:Arial,Helvetica,sans-serif; position:relative; cursor:pointer; transition:all linear .3s; -moz-transition:all linear .3s; -webkit-transition:all linear .3s; -o-transition:all linear .3s; box-shadow:inset 0 2px 0 rgba(255,255,255,.2),0 1px 0 white,inset 0 1px 0 rgba(0,0,0,.2),inset 0 -1px 0 rgba(0,0,0,.2),inset -1px 0 0 rgba(0,0,0,.1),inset 1px 0 0 rgba(0,0,0,.1); -webkit-box-shadow:inset 0 2px 0 rgba(255,255,255,.2),0 1px 0 white,inset 0 1px 0 rgba(0,0,0,.2),inset 0 -1px 0 rgba(0,0,0,.2),inset -1px 0 0 rgba(0,0,0,.1),inset 1px 0 0 rgba(0,0,0,.1); -moz-box-shadow:inset 0 2px 0 rgba(255,255,255,.2),0 1px 0 #FFF,inset 0 1px 0 rgba(0,0,0,.2),inset 0 -1px 0 rgba(0,0,0,.2),inset -1px 0 0 rgba(0,0,0,.1),inset 1px 0 0 rgba(0,0,0,.1); border:none !important; outline:none }
#search-form-feed button:hover { background-color:#535353 }
 
/* css select text */
::selection { background-color:#333; color:#FFF; -moz-text-shadow:0 1px 2px black; -webkit-text-shadow:0 1px 2px black; text-shadow:0 1px 2px black }
::-moz-selection { background-color:#333; color:#FFF; -moz-text-shadow:0 1px 2px black; -webkit-text-shadow:0 1px 2px black; text-shadow:0 1px 2px black }
::-webkit-selection { background-color:#333; color:#FFF; -moz-text-shadow:0 1px 2px black; -webkit-text-shadow:0 1px 2px black; text-shadow:0 1px 2px black }
  
/* pengaturan emticon untuk posting */
.emo.delayLoad { display:inline; text-align:left; margin:0; box-shadow:none; -moz-box-shadow:none; -webkit-box-shadow:none; border:none; background-color:transparent; width:auto; height:auto; border-radius:none; -moz-border-radius:none; -webkit-border-radius:none }

  #error404 { font-size:20px; color:#fff }  
  
/*Comment */
#comments { padding:10px; margin:20px 0 10px }
#comments h4 { color:#fff; font-family:Cambria,Georgia,Times,Serif; font-size:20px; margin:0 -20px 0 -50px; padding:0px 50px; text-align:center; font-weight:bold; line-height:48px; -moz-text-shadow:2px 0 0 #333; -webkit-text-shadow:2px 0 0 #333; text-shadow:2px 0 0 #333; -webkit-box-shadow:inset 0 0 25px #40E0D0,0px 1px 5px #666; -moz-box-shadow:inset 0 0 25px #40E0D0,0px 1px 5px #666; box-shadow:inset 0 0 25px #40E0D0,0px 1px 5px #666; background-color:#4169E1; left:15px; position:relative; }
#comments h4:before { content:&#39; &#39; ; position:absolute; bottom:-10px; left:0; width:0; height:0; border-style:solid; border-width:10px 0 0 10px; border-color:#6495ED #6495ED transparent transparent; }
#comments h4:after { content:&#39; &#39; ; position:absolute; bottom:-10px; right:0; width:0; height:0; border-style:solid; border-width:0 0 10px 10px; border-color:#6495ED transparent transparent #6495ED; }
h4#comment-post-message {display:none}
.comments .comments-content .comment-header{border-bottom:1px solid #B40404;padding-bottom:3px;margin:-1px -3px 10px}
.comment-thread ol {margin:0 0 20px}
.comments .comments-content .comment-thread ol {list-style-type:none}
.comments .comments-content .user {font-style:normal; font-weight:bold}
.comments .comments-content .comment-content {background-color:#fff;color:#000;margin-bottom:2px; padding:6px;text-align:left;overflow:auto}
.comments .comments-content .datetime a:link,.comments .comments-content .datetime a:visited { float:right !important; color:#000 !important; font-size:10px; padding:2px 10px }
.comments .comments-content .comment { margin:6px 0 0; padding:5px; width:100% }
.comments .comments-content .inline-thread { padding:6px 0 0; margin-bottom:-16px }
.comments .comments-content .comment-replies { margin-top:-3px; position:relative; top:-6px }
.comments .comments-content .loadmore { cursor:pointer; margin-top:3em; max-height:3em }
.comments .comments-content .loadmore.loaded { max-height:0; opacity:0; overflow:hidden }
.comments .thread-chrome.thread-collapsed,.comment .continue { background:transparent; padding:6px 0 0 }
.comment-thread .comment-content a,.comments .user a,.comments .comment-thread.inline-thread .user a { color:#151390 }
.comments .user,.comments .comment-thread.inline-thread .user { color:white; font-weight:normal; padding-left:10px }
.deleted-comment { font-style:italic; color:dark-red }
.comments .comments-content .icon.blog-author{position:absolute;right:18px;top:-4px;width:90px;height:20px;background-color:#8A2BE2;-webkit-border-radius:0 0 3px 3px;-moz-border-radius:0 0 3px 3px;-o-border-radius:0 0 3px 3px;border-radius:0 0 3px 3px}
.comments .comments-content .icon.blog-author:after{content:&quot;Aben Mpun&quot;;position:absolute;color:white;text-shadow:0 1px 2px #646464;top:0px;left:10px}
.comments .thread-toggle { cursor:pointer; display:none }
.comment-footer { color:white; font-weight:bold; padding:0 0 10px; text-shadow:1px 1px #000000 }
.item-control { display:inline }
.comments .avatar-image-container{width:42px;max-height:42px;height:42px;padding:2px;-webkit-border-radius:35px;-moz-border-radius:35px;border-radius:35px;border:4px inset #FA8072}
.comments .avatar-image-container img{max-width:42px;width:100%}
.comments .avatar-image-container img:hover { opacity:0.7 }
.comments .inline-thread .avatar-image-container {width:42px;max-height:42px;height:42px;padding:2px;border:4px inset #1E90FF}
.comments .user a:hover,.comments .comment-thread.inline-thread .user a:hover { color:#fff }
.comments .comment-block{margin-left:53px;padding:15px 10px;border-width:2px;border-style:solid;border-color:#8A2BE2 #1E90FF #9ACD32 #FA8072;-webkit-border-radius:25px 10px / 10px 25px;-moz-border-radius:25px 10px / 10px 25px;border-radius:25px 10px / 10px 25px}
.comments .inline-thread .comment-block{margin-left:54px}
.comments .comment-block:before,.comments .comment-block:after{content:&quot;&quot;;width:0;height:0;border-width:8px 10px;border-style:solid;border-color:transparent #FA8072 transparent transparent;position:absolute;top:12px;right:100%}
.comments .comments-content .comment-content { border-bottom:0 solid #ddd }
.comments .thread-chrome.thread-collapsed,.comment .continue {margin:1px 0 0;padding:0}
.comments .comment .comment-actions a {background-color:#9ACD32;transition-duration:1s;-webkit-border-radius:15px;-moz-border-radius:15px;border-radius:15px;-webkit-box-shadow:0 1px 2px rgba(0,0,0,.2);-moz-box-shadow:1px 1px 4px #AAAAAA;box-shadow:0 1px 2px rgba(0,0,0,.2);color:black; left:0;margin-right:4px;padding:3px 7px;position:relative;top:7px}
.comments .comment .comment-actions a:hover {color:#fff;background-color:#E38EF2;-webkit-transition:color .4s ease-in-out;-moz-transition:color .4s ease-in-out;-o-transition:color .4s ease-in-out;-ms-transition:color .4s ease-in-out;transition:color .4s ease-in-out}
.comments .comment .comment-actions a:active {position:relative}
#comment-editor { width:103% !important }
.comment-form { width:100%; max-width:100% }
   
  
/*-- pesanan komen --*/
#pra-comment{position: relative;background:#D1D1D1;width:100%;padding:10px;font:normal 12px trebuchet ms;text-align:justify;border:3px solid #000;margin:0 10px 10px 0;margin-top: 10px;line-height: 1.3em;}
#pra-comment::after, #pra-comment::before {top: 100%;border: solid transparent;content: &quot; &quot;;height: 0;width: 0;position: absolute;pointer-events: none}
#pra-comment::before {border-top-color: #000;border-width: 12px;left: 10%;margin-left: -36px}
#pra-comment::after {border-top-color: #D1D1D1; /* Samakan dengan warna background */border-width: 9px;left: 10%;margin-left: -30px}

/* efek pada jumlah komen */  
.comment-bubble {-webkit-border-radius:35px;-moz-border-radius:35px;border-radius:35px;border:4px inset #828383;background-color:#828383;color:#fff;display:inline-block;float:right;font-size:12px;font-weight:bold;text-align:center;width:30px;position:relative;right:5px;padding:3px 0;margin:-34px 0 0 0;transition-duration:2s}


<b:if cond='data:blog.pageType == &quot;item&quot;'>
/* breadcrumbs */
.breadcrumbs { position:relative; font-size:11px; padding:0 6px; min-height:28px; overflow:hidden; line-height:23px; background-color:#FFF; margin:0 auto; border-bottom:2px solid #ddd } 
.breadcrumbs .homez { display:inline-block; text-indent:-9999px; width:16px; background:transparent url(http://2.bp.blogspot.com/-WvUMu8I1hAs/UQilwS6559I/AAAAAAAAIDI/K8MhVCjfxaA/s1600/spriteiconshare.png) no-repeat -4px -37px }
#blog-pager { display:none }
#kotak-bawah { padding:10px 10px 0 }
 
/* css related posts */
#related-postsx { background-color:#FFF; margin:20px 0 0 0; padding:10px }
#related-postsx h4 { color:#fff; font-family:Cambria,Georgia,Times,Serif; font-size:20px; margin:0 -20px 10px -50px; padding:0px 50px; text-align:center; font-weight:bold; line-height:48px; -moz-text-shadow:2px 0 0 #333; -webkit-text-shadow:2px 0 0 #333; text-shadow:2px 0 0 #333; -webkit-box-shadow:inset 0 0 25px #40E0D0,0px 1px 5px #666; -moz-box-shadow:inset 0 0 25px #40E0D0,0px 1px 5px #666; box-shadow:inset 0 0 25px #40E0D0,0px 1px 5px #666; background-color:#4169E1; left:15px; position:relative; }
#related-postsx h4:before { content:&#39; &#39; ; position:absolute; bottom:-10px; left:0; width:0; height:0; border-style:solid; border-width:10px 0 0 10px; border-color:#6495ED #6495ED transparent transparent; }
#related-postsx h4:after { content:&#39; &#39; ; position:absolute; bottom:-10px; right:0; width:0; height:0; border-style:solid; border-width:0 0 10px 10px; border-color:#6495ED transparent transparent #6495ED; }


#related-postsx ul,#related-postsx li { padding:0; list-style:none; margin-top:3px; overflow:hidden; position:relative }
#related-postsx ul.loadingxx { width:100%; height:50px; background:transparent url(http://3.bp.blogspot.com/-tzYpmrIlyEA/UUulST7g5WI/AAAAAAAABqs/GC5WETbgXCc/s1600/loading-dip.gif) no-repeat 50% 50% }
#related-postsx li { border:4px solid #666; width:100%; float:left; height:135px; margin:0; -o-transition:0.6s linear; -ms-transition:0.6s linear; -moz-transition:0.6s linear; -webkit-transition:0.6s linear; transition:all .4s ease-out }
#related-postsx li:nth-child(1) { float:left; width:33%; margin:0 2px 2px 0 }
#related-postsx li:nth-child(2) { float:left; width:33.4%; margin:0 0 2px 0 }
#related-postsx li:nth-child(3) { float:right; width:33%; margin:0 0 2px 0 }
#related-postsx li:nth-child(4) { float:right; width:49.9% }
#related-postsx li:nth-child(5) { float:left; width:49.9% }
#related-postsx .overlayb { width:100%; height:250px; background-image:url(http://1.bp.blogspot.com/-FtnGJHMcWH8/UIV3IE-aaJI/AAAAAAAAGHs/WvLypnWxg5A/s1600/linebg-fade.png); z-index:1; position:absolute; background-position:0 0; background-repeat:repeat-x; bottom:-50%; -o-transition:0.6s linear; -ms-transition:0.6s linear; -moz-transition:0.6s linear; -webkit-transition:0.6s linear; transition:all .4s ease-out }
#related-postsx li:hover .overlayb { -ms-filter:&quot; progid:DXImageTransform.Microsoft. Alpha(Opacity=10)&quot; ; filter:alpha(opacity=10); -khtml-opacity:0.1; -moz-opacity:0.1; opacity:0.1; transition-duration:0s }
#related-postsx img { width:100%; position:absolute; bottom:-40%; height:250px }
#related-postsx strong { position:absolute; left:2px; bottom:30px; color:white; padding:0 10px; z-index:4; width:100%; font-size:120%; font-weight:bold; -moz-text-shadow:0 1px 2px black; -webkit-text-shadow:0 1px 2px black; text-shadow:0 1px 2px black; line-height:1.3em }
#related-postsx .infonya { position:absolute; left:2px; bottom:10px; padding:0 10px; width:100%; z-index:3; color:white; -moz-text-shadow:0 1px 2px black; -webkit-text-shadow:0 1px 2px black; text-shadow:0 1px 2px black }
#related-postsx .dt { display:none; margin-right:5px; padding-right:5px; border-right:1px solid #E9E9E9 }
#related-postsx .jkmt {display:none; bottom:0; right:0; padding:2px 4px; top:5px; background-color:#000; z-index:3 }
.auty {display:none}
.kotak-dalem { background-color:transparent; padding:0; -moz-box-shadow:none; -webkit-box-shadow:none; box-shadow:none; border:none; margin-bottom:0 }
</b:if>
<b:if cond='data:blog.pageType == &quot;static_page&quot;'>
#kotak-bawah { padding:10px 10px 0 } 
</b:if>


@media only screen and (min-width:1160px) and (max-width:1500px) {
body { font-size:13px }
#text-body { font-size:14px }
}
@media only screen and (max-width:1024px) {
body { font-size:12px }
#text-body { font-size:12px }
}  
@media only screen and (min-width:768px) and (max-width:989px) {
#search-form-feed { margin-right:108px }
#outer-css {width:730px;}
#kotak-utama { width:100% } 
#kotak-bawah { width:100% } 
}
@media only screen and (max-width:767px) {
#outer-css {width:540px;}
#atas-posting {width:100%;}
#kotak-utama { width:100%;}
#kotak-bawah { width:100% } 
#nav{-webkit-box-shadow:inset 0 0 25px rgba(0,0,0,0.3),0px 1px 5px #333;-moz-box-shadow:inset 0 0 25px rgba(0,0,0,0.3),0px 1px 5px #333;box-shadow:inset 0 0 25px rgba(0,0,0,0.3),0px 1px 5px #333;}
ul#navinti,#topnav,#head-ads,#navmobitop ul,#navmobi ul{display:none}
#navmobi,#navmobitop,#navmobi #navinti,#navmobitop #topnav{display:block}
#nav-top .menutopx,#nav{height:auto;position:relative}
#nav-top{min-height:25px}
.jdulatas{float:none}
#navmobitop ul,#navmobitop li,#navmobi ul,#navmobi li{overflow:hidden;padding:0;margin:0;list-style:none}
#navmobitop ul{width:100%}
#mobilenavtop{text-decoration:none;float:right;right:0;top:0;padding:0 15px 0 8px;background-color:#D6D6D6;position:absolute}
#navmobitop li{margin:1px 0}
#navmobi{line-height:30px}
#navmobi a{text-decoration:none;color:white;padding:0 15px;display:block;position:relative}
#navmobi li ul a{padding-left:25px}
#navmobi li ul ul a{padding-left:35px}
#navmobitop li a{display:block;padding:0 10px;background-color:#F7F7F7;text-decoration:none;position:relative}
#navmobitop li ul a{padding-left:20px}
#navmobitop li a:hover,#navmobi ul a:hover{background-color:#666}
#navmobi ul a{background-color:#333;margin:0 auto;width:97%}
#mobilenavtop::after,#mobilenav::after,#navmobitop li a::after,#navmobi ul a::after{content:&quot;&quot;;width:0;height:0;border-width:5px 3px;border-style:solid;border-color:#1295C9 transparent transparent transparent;position:absolute;top:50%;margin-top:-3px;right:5px}
#mobilenav::after{border-width:5px 5px;border-color:white transparent transparent transparent;margin-top:-2px;right:10px}
#mobilenavtop.active::after{border-color:transparent transparent #1295C9 transparent;margin-top:-8px}
#mobilenav.active::after{border-color:transparent transparent white transparent;margin-top:-6px}
#navmobitop li a::after{border-width:5px 4px;border-color:transparent transparent transparent #1295C9;margin-top:-5px;right:8px}
#navmobitop li.dgnsubtop:hover &gt;a::after{border-color:transparent transparent #1295C9 transparent;margin-top:-8px}
#navmobi ul a::after{border-width:5px 5px;border-color:transparent transparent transparent white;margin-top:-5px;right:7px}
#search-form-feed{float:none;width:97%;margin:0 auto;margin-top:3px;height:40px}
#search-result-container{width:100%}
} 
@media only screen and (max-width: 650px) {
#outer-css { width: 570px }
#kotak-utama { width: 100% }
#kotak-bawah { width: 100%; margin:5px 0 0 0 }
.addthis_toolbox,#beakingnews {display:none }
}
@media only screen and (max-width: 580px) {
#outer-css { width: 500px }
#kotak-utama { width: 100% }
#kotak-bawah { width: 100% }
#related-postsx strong { font-size: 15px; font-weight: bold; line-height: 1.3em; bottom: 35px; padding: 0 3px }
#related-postsx .infonya { position: absolute; bottom: 5px; padding: 0 3px }
#related-postsx strong { -moz-text-shadow: 0 1px 2px black; -webkit-text-shadow: 0 1px 2px black; text-shadow: 0 1px 2px black }
#related-postsx .infonya { -moz-text-shadow: 0 1px 2px black; -webkit-text-shadow: 0 1px 2px black; text-shadow: 0 1px 2px black }
#backtop { display:none }
}
@media only screen and (max-width: 490px) {
#outer-css { width: 430px }
#kotak-utama { width: 100% }
#kotak-bawah { width: 100% }
#sidebar-left,#sidebar-right { width:100%; float:left }
#related-postsx strong { font-size: 15px; font-weight: bold; line-height: 1.3em; bottom: 35px; padding: 0 3px }
#related-postsx .infonya { position: absolute; bottom: 5px; padding: 0 3px }
#related-postsx strong { -moz-text-shadow: 0 1px 2px black; -webkit-text-shadow: 0 1px 2px black; text-shadow: 0 1px 2px black }
#related-postsx .infonya { -moz-text-shadow: 0 1px 2px black; -webkit-text-shadow: 0 1px 2px black; text-shadow: 0 1px 2px black }
#related-postsx .dt { border-right: 0 solid #E9E9E9 }
.auty { display: none }
#infox,.addthis_toolbox,#beakingnews {display:none }
#kredit-link .right { float:left; text-align:center; overflow:hidden; margin:0 auto; width:100% }
#kredit-link .left { float:left; text-align:center; overflow:hidden;margin:0 auto; width:100% }
}
@media only screen and (max-width: 479px) {
#outer-css { width: 280px; margin: 0 auto }
#mdf-randompostx { display: none }
#kotak-utama { width: 100% }
#kotak-bawah { width: 100% }
.content_box img { width:100%; display:block; text-align:center } 
#comments.comments.content_box img { display:inline; width:auto }
#related-postsx li { width: 100%; height: 150px; margin: 0 0 2px }
#related-postsx li:nth-child(1) { float:left; width:100%; margin: 0 0 2px  }
#related-postsx li:nth-child(2) { float:right; width:100%; margin: 0 0 2px  }
#related-postsx li:nth-child(3) { float:left; width:100% }
#related-postsx li:nth-child(4) { float:right; width:100% }
#related-postsx li:nth-child(5) { float:right; width:100% }
#related-postsx .dt { border-right: 1px solid #E9E9E9 }
#related-postsx .jkmt { display:none }
.auty { display: inline }
a.rssx { display:none }
.emoWrap { display:none }    
}   
@media screen and (max-width: 260px) {
#outer-css { width: 210px; margin: 0 auto }
#kotak-utama { width: 100% }
#kotak-bawah { width: 100% }
#widgets1 h2 { font-size:11px }
#widgets2 h2 { font-size:11px }
a.twitterx { display:none }
}
</style>